/* eslint-disable react-native/no-inline-styles */
import * as React from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createNativeStackNavigator} from '@react-navigation/native-stack';

import {HomeScreen, DetailsScreen, LoginScreen} from './components/screen';
import {Image} from 'react-native';

const Stack = createNativeStackNavigator();

// 自定义Titile
const LogoTitle = () => {
  return (
    <Image
      style={{width: 35, height: 35}}
      source={require('../public/assets/images/title_logo.png')}
    />
  );
};

const StackScreen = () => {
  return (
    <Stack.Navigator initialRouteName="Login">
      <Stack.Screen
        name="Login"
        component={LoginScreen}
        options={{
          // 不显示Header
          headerShown: false,
        }}
      />
      <Stack.Screen
        name="Home"
        component={HomeScreen}
        options={{headerTitle: props => <LogoTitle {...props} />}}
      />
      <Stack.Screen name="Details" component={DetailsScreen} />
    </Stack.Navigator>
  );
};

function App() {
  return (
    <NavigationContainer>
      <StackScreen />
    </NavigationContainer>
  );
}

export default App;
